<template>
  <van-popup
    v-model:show="showPicker"
    @click-overlay="onCancel"
    round
    position="bottom"
  >
    <van-picker
      :columns="listData"
      :columns-field-names="customFieldName"
      @cancel="onCancel"
      @confirm="onConfirm"
      :default-index="sIndex"
    />
  </van-popup>
</template>
<script>
import "@/api/index";
import { ref, reactive, toRefs, onMounted } from "vue";
import router from "../router";
export default {
  props: ["showPicker", "sIndex"],
  setup(props, { emit }) {
    const customFieldName = {
      text: "title",
    };
    const state = reactive({
      showPicker: props.showPicker,
      sIndex: props.sIndex ? 0 : props.sIndex,
      listData: [
        { title: "重点指标数据", id: "1" },
        { title: "综合满意度", id: "2" },
        { title: "投诉", id: "3" },
        { title: "手机", id: "4" },
        { title: "家宽", id: "5" },
        { title: "政企", id: "6" },
        { title: "触点", id: "7" },
      ],
    });

    const onCancel = () => {
      state.showPicker = false;
      emit("hiddenPicker", false);
    };

    const onConfirm = (value) => {
      console.log(router.currentRoute.value.path);
      let path = router.currentRoute.value.path;
      state.showPicker = false;
      emit("hiddenPicker", false);

      if (value.id == "1") {
        if (path == "/") return;
        router.replace("/");
      } else if (value.id == "2") {
        if (path == "/zhmyd/index") return;
        router.replace({ name: "zhmyd" });
      } else if (value.id == "3") {
        if (path == "/tousu/index") return;
        router.replace({ name: "tousu" });
      } else if (value.id == "4") {
        if (path == "/mobile/index") return;
        router.replace({ name: "mobile" });
      } else if (value.id == "5") {
        if (path == "/jiakuan/index") return;
        router.replace({ name: "jiakuan" });
      } else if (value.id == "6") {
        if (path == "/zhengqi/index") return;
        router.replace({ name: "zhengqi" });
      } else if (value.id == "7") {
        if (path == "/chudian/index") return;
        router.replace({ name: "chudian" });
      }
    };

    return {
      ...toRefs(state),
      customFieldName,
      onConfirm,
      onCancel,
    };
  },
};
</script>
